<?php if (!defined('THINK_PATH')) exit(); /*a:1:{s:81:"D:\wamp\www\daiju\s78_daiju\tp5\public/../application/index\view\index\login.html";i:1539565910;}*/ ?>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>login</title>
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

    <!-- 可选的 Bootstrap 主题文件（一般不用引入） -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

    <style>
        body {
            margin: 50px 0;
            text-align: center;
        }
        .inp {
            border: 1px solid gray;
            padding: 0 10px;
            width: 200px;
            height: 30px;
            font-size: 18px;
        }
        .btn {
            border: 1px solid gray;
            width: 100px;
            height: 30px;
            font-size: 18px;
            cursor: pointer;
        }
        #embed-captcha {
            width: 300px;
            margin: 0 auto;
        }
        .show {
            display: block;
        }
        .hide {
            display: none;
        }
        #notice {
            color: red;
        }
    </style>

</head>
<body style="background-image: url(/static/index/images/bglogin.jpg);">
<div class="container-fluid">
    <div class="row">
      <div class="col-xs-6 col-md-2"></div>
      <div class="col-xs-6 col-md-8">
        <table class="table table-striped">
          <form class="popup" action="<?php echo url('index/Index/doLogin'); ?>" name="myform" method="post" onsubmit="return checkForm()">
              <tr></tr>
              <tr>
                  <th><h3 style="text-align: center; color:blue;">欢迎登录</h3></th>
              </tr>
              <tr></tr>

              <tr>
              <td>
                  <label for="customer_name">手机号码：</label>
                  <input class="inp" id="customer_name" type="text" name="customer_name"  value="" placeholder="请输入您的手机号" autocomplete="off"  onblur="checkTel()" autofocus maxlength="11">
                  <td id="teltab">* 必填项,请输入正确号码</td>
              </td>
              </tr>
              <tr></tr>
              <br>
              <tr>
              <td>
                  <label for="customer_password">登录密码：</label>
                  <input class="inp" id="customer_password" type="password" name="customer_password" value="" placeholder="请输入您的密码" autocomplete="off" onblur="checkPass()">
                  <td id="ptab">* 必填项,请输入正确密码</td>
              </td>
              </tr>
            <tr></tr>
              
              <br>
              <tr>
              <td>
              <div id="embed-captcha"></div>
              <p id="wait" class="show">正在加载验证码......</p>
              <p id="notice" class="hide">请先完成验证</p>
              <br>
              </td>
              </tr>
              <!-- <tr></tr> -->
              <tr>
                <td>
                  <label for="customer_password">记住密码：</label>
                  <input type="checkbox" name="checkbox" value="1" checked>
                </td>
              </tr>
              <tr></tr>
              <tr></tr>
              <tr>
              <td>
              <input class=" btn-info btn-lg" id="embed-submit" type="submit" value="登录">
              </td>
              </tr>
          </form>
          <tr></tr>
          <tr>
          <td>
          <a href="<?php echo url('index/Index/register'); ?>" class="btn btn-info">注册</a>
          </td>
          </tr>
        </table>
      </div>
      <div class="col-xs-6 col-md-2"></div>
    </div>
</div>
<br>
<br>
<br>
<br>



<script src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.js"></script>
<script src="/static/index/js/gt.js"></script>
<script>
    var handlerEmbed = function (captchaObj) {
        $("#embed-submit").click(function (e) {
            var validate = captchaObj.getValidate();
            if (!validate) {
                $("#notice")[0].className = "show";
                setTimeout(function () {
                    $("#notice")[0].className = "hide";
                }, 2000);
                e.preventDefault();
            }
        });
        // 将验证码加到id为captcha的元素里，同时会有三个input的值：geetest_challenge, geetest_validate, geetest_seccode
        captchaObj.appendTo("#embed-captcha");
        captchaObj.onReady(function () {
            $("#wait")[0].className = "hide";
        });
        // 更多接口参考：http://www.geetest.com/install/sections/idx-client-sdk.html
    };
    $.ajax({
        // 获取id，challenge，success（是否启用failback）
        url: "checkGeetest?t=" + (new Date()).getTime(), // 加随机数防止缓存
        type: "get",
        dataType: "json",
        success: function (data) {
            console.log(data);
            // 使用initGeetest接口
            // 参数1：配置参数
            // 参数2：回调，回调的第一个参数验证码对象，之后可以使用它做appendTo之类的事件
            initGeetest({
                gt: data.gt,
                challenge: data.challenge,
                new_captcha: data.new_captcha,
                product: "embed", // 产品形式，包括：float，embed，popup。注意只对PC版验证码有效
                offline: !data.success // 表示用户后台检测极验服务器是否宕机，一般不需要关注
                // 更多配置参数请参见：http://www.geetest.com/install/sections/idx-client-sdk.html#config
            }, handlerEmbed);
        }
    });
</script>

<script>
    function checkTel() {
        var customer_name = document.myform.customer_name.value;
        var teltab = document.getElementById('teltab');
        if(/^1(?:3\d|4[4-9]|5[0-35-9]|6[67]|7[013-8]|8\d|9\d)\d{8}$/.test(customer_name)){
            teltab.innerHTML = '*通过验证';
            teltab.style.color = '#0a0';
            return true;
        }else{
            teltab.innerHTML = '*电话格式不正确';
            teltab.style.color = '#f00';
            return false;
        }
    }

    function checkPass() {
        var customer_password = document.myform.customer_password.value;
        var ptab = document.getElementById('ptab');
        if(customer_password.length < 6 || customer_password.length > 12){
            ptab.innerHTML = '*密码长度不合法！';
            ptab.style.color = '#f00';
            return false;
        }else{
            ptab.innerHTML = '*通过验证';
            ptab.style.color = '#0a0';
            return true;
        }
    }

    // 表单提交验证
    function checkForm() {
        return checkTel() && checkPass();
    }

</script>

<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
</body>
</html>

